<template>
    <div class="index_wrap__67lJ7"
        data-log="{&quot;oid&quot;:&quot;page_webpage_cloud_push_song_homepage&quot;,&quot;isPage&quot;:true,&quot;events&quot;:[&quot;_pv&quot;,&quot;_pd&quot;],&quot;params&quot;:{}}">
        <div class="index_banner__HpTIt">
            <div class="ant-carousel">
                <div class="slick-slider slick-initialized">
                    <div class="slick-list">
                        <div class="slick-track"
                            style="opacity: 1; transform: translate3d(0px, 0px, 0px); width: 100%; transition: -webkit-transform 500ms;">
                            <div data-index="0" class="slick-slide slick-active slick-current" tabindex="-1"
                                aria-hidden="false" style="outline: none; width: 100%;">
                                <div>
                                    <div class="index_imgWrap__E40YF" tabindex="-1"
                                        style="width: 100%; display: inline-block;"><img
                                            src="//nos.netease.com/yyimgs/obj/wo7DmMOIwrXClD_DgMK-/57441966483/3160/0e8c/072b/f7d8e1a6ea89c97ef139cfe197845372.jpg?imageView=1&amp;type=webp&amp;thumbnail=2880x0"
                                            style="width: 100%;"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="index_songContainer__1HyQv">
            <div class="index_searchContainer__eVY4Z">
                <div class="index_search__8F3p+">
                    <div class="index_title__dsVOk">好歌上热门，就用云推歌</div>
                    <div class="index_text__E+R+y">让音乐加速，好歌值得更多人听到</div>


                    <div class="searchWrap">
                        <span class="aigw">
                            <span class="aiw">
                                <span class="aiaw">
                                    <span class="ant-input-prefix">
                                        <span class="sfi">
                                            <svg viewBox="64 64 896 896" focusable="false" data-icon="search"
                                                width="1em" height="1em" fill="currentColor" aria-hidden="true">
                                                <path
                                                    d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z">
                                                </path>
                                            </svg>
                                        </span>
                                    </span>
                                    <input placeholder="搜索歌曲、歌手，帮他上热门" class="ant-input" type="text" value="">
                                </span>
                                <span class="aiga">
                                    <button type="button" class="ant-btn">
                                        <span>搜歌加热</span>
                                    </button>
                                </span>
                            </span>
                        </span>
                    </div>
                </div>
                <!-- 悬浮框 -->
                <div class="ib">
                    <div class="ibu">
                        <div class="itx">
                            <div class="ity">我的余额</div>
                            <div class="ilw">
                                <a href="/st/ad-song/account">查看明细
                                    <span role="img" aria-label="right" class="anticon anticon-right">
                                        <svg viewBox="64 64 896 896" focusable="false" data-icon="right" width="1em"
                                            height="1em" fill="currentColor" aria-hidden="true">
                                            <path
                                                d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z">
                                            </path>
                                        </svg>
                                    </span>
                                </a>
                            </div>
                        </div>
                        <div class="ibl">
                            <div class="isn">¥0.00</div>
                            <div class="idt">包含现金<span class="inr">0.00</span>及赠款<span class="inr">0</span></div>
                        </div><button type="button" class="at"><a href="/st/ad-song/recharge">去充值</a></button>
                    </div>
                </div>

            </div>
            <div class="index_songWrap__0L-d6" style="display: none;">
                <div class="index_title__zv7uf">
                    <div class="index_text__czqUa">我的歌曲</div>
                    <div class="index_link__ZuMTw"><a href="/st/ad-song/moresong">查看全部<span role="img"
                                aria-label="right" class="anticon anticon-right"><svg viewBox="64 64 896 896"
                                    focusable="false" data-icon="right" width="1em" height="1em" fill="currentColor"
                                    aria-hidden="true">
                                    <path
                                        d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z">
                                    </path>
                                </svg></span></a></div>
                </div>
                <div class="index_listContainer__WNPVn"></div>
            </div>
            <div class="index_songWrap__0L-d6" style="display: block;">
                <div class="index_title__zv7uf">
                    <div class="index_text__czqUa">我的喜欢</div>
                    <div class="index_link__ZuMTw"><a href="/st/ad-song/moresong">查看全部<span role="img"
                                aria-label="right" class="anticon anticon-right"><svg viewBox="64 64 896 896"
                                    focusable="false" data-icon="right" width="1em" height="1em" fill="currentColor"
                                    aria-hidden="true">
                                    <path
                                        d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z">
                                    </path>
                                </svg></span></a></div>
                </div>
                <div class="index_listContainer__WNPVn">
                    <div class="index_listItem__nU5Gg">
                        <div class="index_desc__vfEks">
                            <div class="index_image__qrxni"><img
                                    src="//p1.music.126.net/nOHtDvOGTv80qqe91znl5A==/109951167422645380.jpg?imageView=1&amp;type=webp&amp;thumbnail=368x0"
                                    style="width: 184px; height: 184px;"></div>
                            <div class="index_songName__RUIil">玫瑰少年·2022</div>
                            <div class="index_artistName__FGrxd">WiFi歪歪</div>
                        </div>
                        <div class="index_pushSong__b5Sre"><img
                                src="https://p5.music.126.net/obj/wo3DlcOGw6DClTvDisK1/22374261282/f6df/0764/eef8/e5bcaa0cb828dd0e0f9b654404fedf43.png"
                                alt="" width="18" height="18"
                                style="width: 18px; height: 18px; position: relative; top: -2px;">
                            <div class="index_text__czqUa">为TA打call</div><button type="button"
                                class="ant-btn ant-btn-primary sc-aXZVg fEHaAe index_btn__7CgVP"><span>推
                                    歌</span></button>
                        </div>
                    </div>
                    <div class="index_listItem__nU5Gg">
                        <div class="index_desc__vfEks">
                            <div class="index_image__qrxni"><img
                                    src="//p1.music.126.net/AYNBdRxJ8EdZo4xFjp7b4Q==/109951163191178425.jpg?imageView=1&amp;type=webp&amp;thumbnail=368x0"
                                    style="width: 184px; height: 184px;"></div>
                            <div class="index_songName__RUIil">在你的身边</div>
                            <div class="index_artistName__FGrxd">盛哲</div>
                        </div>
                        <div class="index_pushSong__b5Sre"><img
                                src="https://p5.music.126.net/obj/wo3DlcOGw6DClTvDisK1/22374261282/f6df/0764/eef8/e5bcaa0cb828dd0e0f9b654404fedf43.png"
                                alt="" width="18" height="18"
                                style="width: 18px; height: 18px; position: relative; top: -2px;">
                            <div class="index_text__czqUa">为TA打call</div><button type="button"
                                class="ant-btn ant-btn-primary sc-aXZVg fEHaAe index_btn__7CgVP"><span>推
                                    歌</span></button>
                        </div>
                    </div>
                    <div class="index_listItem__nU5Gg">
                        <div class="index_desc__vfEks">
                            <div class="index_image__qrxni"><img
                                    src="//p1.music.126.net/WafK2OQfEtqXitdDXJ772Q==/109951163252847249.jpg?imageView=1&amp;type=webp&amp;thumbnail=368x0"
                                    style="width: 184px; height: 184px;"></div>
                            <div class="index_songName__RUIil">可不可以</div>
                            <div class="index_artistName__FGrxd">张紫豪</div>
                        </div>
                        <div class="index_pushSong__b5Sre"><img
                                src="https://p5.music.126.net/obj/wo3DlcOGw6DClTvDisK1/22374261282/f6df/0764/eef8/e5bcaa0cb828dd0e0f9b654404fedf43.png"
                                alt="" width="18" height="18"
                                style="width: 18px; height: 18px; position: relative; top: -2px;">
                            <div class="index_text__czqUa">为TA打call</div><button type="button"
                                class="ant-btn ant-btn-primary sc-aXZVg fEHaAe index_btn__7CgVP"><span>推
                                    歌</span></button>
                        </div>
                    </div>
                    <div class="index_listItem__nU5Gg">
                        <div class="index_desc__vfEks">
                            <div class="index_image__qrxni"><img
                                    src="//p1.music.126.net/wHGVAWaCf_DySTVy3EKFZQ==/109951168957825804.jpg?imageView=1&amp;type=webp&amp;thumbnail=368x0"
                                    style="width: 184px; height: 184px;"></div>
                            <div class="index_songName__RUIil">Can We Kiss Forever?</div>
                            <div class="index_artistName__FGrxd">Kina</div>
                        </div>
                        <div class="index_pushSong__b5Sre"><img
                                src="https://p5.music.126.net/obj/wo3DlcOGw6DClTvDisK1/22374261282/f6df/0764/eef8/e5bcaa0cb828dd0e0f9b654404fedf43.png"
                                alt="" width="18" height="18"
                                style="width: 18px; height: 18px; position: relative; top: -2px;">
                            <div class="index_text__czqUa">为TA打call</div><button type="button"
                                class="ant-btn ant-btn-primary sc-aXZVg fEHaAe index_btn__7CgVP"><span>推
                                    歌</span></button>
                        </div>
                    </div>
                    <div class="index_listItem__nU5Gg">
                        <div class="index_desc__vfEks">
                            <div class="index_image__qrxni"><img
                                    src="//p1.music.126.net/SgcH09uTKc1Hb-ZHQbtyGg==/1364493981206667.jpg?imageView=1&amp;type=webp&amp;thumbnail=368x0"
                                    style="width: 184px; height: 184px;"></div>
                            <div class="index_songName__RUIil">我好想你</div>
                            <div class="index_artistName__FGrxd">徐佳莹</div>
                        </div>
                        <div class="index_pushSong__b5Sre"><img
                                src="https://p5.music.126.net/obj/wo3DlcOGw6DClTvDisK1/22374261282/f6df/0764/eef8/e5bcaa0cb828dd0e0f9b654404fedf43.png"
                                alt="" width="18" height="18"
                                style="width: 18px; height: 18px; position: relative; top: -2px;">
                            <div class="index_text__czqUa">为TA打call</div><button type="button"
                                class="ant-btn ant-btn-primary sc-aXZVg fEHaAe index_btn__7CgVP"><span>推
                                    歌</span></button>
                        </div>
                    </div>
                </div>
            </div>

            <div class="index_songWrap__0L-d6" style="display: none;">
                <div class="index_title__zv7uf">
                    <div class="index_text__czqUa">最近播放</div>
                    <div class="index_link__ZuMTw"><a href="/st/ad-song/moresong">查看全部<span role="img"
                                aria-label="right" class="anticon anticon-right"><svg viewBox="64 64 896 896"
                                    focusable="false" data-icon="right" width="1em" height="1em" fill="currentColor"
                                    aria-hidden="true">
                                    <path
                                        d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z">
                                    </path>
                                </svg></span></a></div>
                </div>
                <div class="index_listContainer__WNPVn"></div>
            </div>
        </div>
        <div class="index_clientContainer__o2+HF"
            style="background-image: url(&quot;https://p5.music.126.net/obj/wonDlsKUwrLClGjCm8Kx/23250918840/b97b/fe65/c036/c925e7ffedf516e9a6bd925bc6db46d5.png?imageView=1&amp;type=webp&amp;thumbnail=1650x0&quot;);">
            <div class="index_clientWrap__+z7K+">
                <div class="index_title__dsVOk">助力好歌孵化，让更多人听到</div>
                <div class="index_text__E+R+y">累计帮助超<span class="index_num__YVw8l"><span
                            class="index_digit__7ZzD+">10</span><span class="index_unit__qNkKM">w</span></span>
                    首歌曲站内歌曲热度值提升</div>
                <div class="index_text__E+R+y" style="margin-top: 16px;">音乐人喜爱的新歌冷启/上榜破圈流量工具</div>
                <div class="index_subTitle__ni0Fx">客户信赖、共创未来</div>
                <div class="index_text__E+R+y" style="margin-top: 24px;">
                    已有超百家版权方、众多优质音乐人、广大音乐爱好者及品牌合作歌曲推广</div>
            </div>
        </div>
        <div class="index_questionContainer__0G9yD">
            <div class="index_questionWrap__YgYYy">
                <div class="index_title__dsVOk">
                    <div class="index_text__E+R+y">常见问题 FAQ</div><a class="index_link__dqG8V"
                        href="https://y.music.163.com/m/at/63d64bd9fa0ca03a7952c50f">查看全部<span role="img"
                            aria-label="right" class="anticon anticon-right"><svg viewBox="64 64 896 896"
                                focusable="false" data-icon="right" width="1em" height="1em" fill="currentColor"
                                aria-hidden="true">
                                <path
                                    d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z">
                                </path>
                            </svg></span></a>
                </div>
                <ol class="index_questions__j3o0h">
                    <li class="index_questionItem__fswFn">什么是云推歌？<ol class="index_answers__zv+Ya index_single__Rol4J">
                            <li class="index_answerItem__sckHY">云推歌提供基于歌曲播放量增长的定向算法推荐服务， 给喜爱的歌曲做推广的工具。
                            </li>
                        </ol>
                    </li>
                    <li class="index_questionItem__fswFn">如何找到“云推歌”？<ol
                            class="index_answers__zv+Ya index_single__Rol4J">
                            <li class="index_answerItem__sckHY">通过云音乐app检索“云推歌”即可直达工具页面。</li>
                        </ol>
                    </li>
                    <li class="index_questionItem__fswFn">云推歌可以投放在哪些渠道？<ol
                            class="index_answers__zv+Ya index_single__Rol4J">
                            <li class="index_answerItem__sckHY">
                                云推歌会在算法覆盖的推荐场景、歌单场景、歌曲评论页、搜索banner等多场景进行精准曲风语种及人群自动匹配推荐。</li>
                        </ol>
                    </li>
                    <li class="index_questionItem__fswFn">怎么推广？<ol class="index_answers__zv+Ya ">
                            <li class="index_answerItem__sckHY">通过搜索进入云推歌页面；</li>
                            <li class="index_answerItem__sckHY">选择歌曲推广（支持自动匹配最近播放歌曲选择、歌曲检索、个人歌曲）；</li>
                            <li class="index_answerItem__sckHY">选择充值金额；</li>
                            <li class="index_answerItem__sckHY">选择播放量下单；</li>
                            <li class="index_answerItem__sckHY">进行推广。</li>
                        </ol>
                    </li>
                    <li class="index_questionItem__fswFn">为什么我的歌曲不能推广？<ol class="index_answers__zv+Ya ">
                            <li class="index_answerItem__sckHY">以下两类无法进行推广：a. 无版权及版权到期歌曲；b. 负面及涉政歌曲；
                            </li>
                            <li class="index_answerItem__sckHY">其他情况可联系客服或运营进行歌曲配置。</li>
                        </ol>
                    </li>
                    <li class="index_questionItem__fswFn">什么是互动指数及完播指数？<ol
                            class="index_answers__zv+Ya index_single__Rol4J">
                            <li class="index_answerItem__sckHY">
                                互动指数是根据用户收听后的评论、关注、红心的多维互动行为的综合指标，指标数据越高代表效果越好；完播指数是根据用户收听时的完整播放行为的计算指标，指标数据越高代表效果越好。
                            </li>
                        </ol>
                    </li>
                </ol>
            </div>
        </div>
        <div class="index_footer__YToEL">
            <div class="index_footerWrap__QMoAs">
                <div class="index_logoContainer__7+FHa">
                    <h1 class="index_logo__7ymDh">
                        <div class="index_imgWrap__E40YF"><img class="index_logoImg__O9+dU"
                                src="https://p5.music.126.net/obj/wo3DlcOGw6DClTvDisK1/22394509892/bbff/779e/10ee/d1111078b62dd0549fb814306b53e5b5.png"
                                width="24" height="24" alt=""></div><a class="index_logoLink__rqY80"
                            href="/#"><span>网易云音乐</span></a>
                    </h1>
                </div>
                <div class="index_text__E+R+y">网易公司版权所有©1997-2023杭州乐读科技有限公司运营</div>
                <div class="index_text__E+R+y"><a target="_blank"
                        href="https://p5.music.126.net/obj/wo3DlcOGw6DClTvDisK1/8282703158/452a/ca0c/3a10/caad83bc8ffaa850a9dc1613d74824fc.png"
                        rel="noreferrer">浙网文[2021] 1186-054号</a> 粤B2-20090191-18 工业和信息化部备案管理系统网站</div>
            </div>
        </div>
    </div>
    <div class="index_feedbackWrap__ODvDd">
        <div class="index_bar__PRbWW"><img
                src="//p6.music.126.net/obj/wonDlsKUwrLClGjCm8Kx/45810308512/d428/8741/5907/225ff1a518706c83380d782b8abab3fa.jpg?imageView=1&amp;type=webp&amp;thumbnail=48x0"
                style="width: 24px; height: 24px;">
            <div class="index_text__4P5Vt">咨询反馈</div>
        </div>
        <div class="index_window__s0lmU" style="display: none;">
            <div class="index_subText__FxbRY">更多问题请添加</div>
            <div class="index_text__4P5Vt">云音乐专属顾问咨询</div><img
                src="//p5.music.126.net/obj/wonDlsKUwrLClGjCm8Kx/59868833734/33d6/220c/eacd/85a5f227d12c52d4e416edd68c78ea05.png?imageView=1&amp;type=webp&amp;thumbnail=300x0"
                style="width: 100px; height: 100px;">
        </div>
    </div>
</template>

<script setup lang="ts">

</script>

<style lang="scss" scoped>
.index_wrap__67lJ7 {
    align-items: stretch;
    display: flex;
    flex-direction: column;
    min-width: 1440px;

    .index_banner__HpTIt {
        height: 440px;
        background: linear-gradient(95.5deg, rgb(0, 0, 0) 17.7%, rgb(69, 78, 91));
        box-sizing: border-box;

        ant-carousel {
            font-feature-settings: "tnum", "tnum";
            color: rgba(0, 0, 0, 0.85);
            font-size: 14px;
            line-height: 1.5715;
            font-variant: tabular-nums;
            list-style: none;
            margin: 0px;
            padding: 0px;

            .slick-slider {
                -webkit-tap-highlight-color: transparent;
                box-sizing: border-box;
                display: block;
                position: relative;
                touch-action: pan-y;

                .slick-list {
                    touch-action: pan-y;
                    transform: translateZ(0px);
                    display: block;
                    position: relative;
                    margin: 0px;
                    overflow: hidden;
                    padding: 0px;

                    .slick-track {
                        display: block;
                        left: 0px;
                        position: relative;
                        top: 0px;
                        touch-action: pan-y;

                        .index_imgWrap__E40YF {
                            cursor: pointer;
                            max-height: 440px;
                            overflow: hidden;
                            width: 100%;
                            display: inline-block;
                            vertical-align: bottom;
                            box-sizing: border-box;

                            img {
                                border-style: none;
                                vertical-align: middle;
                                overflow-clip-margin: content-box;
                                overflow: clip;
                                box-sizing: border-box;
                            }
                        }
                    }
                }
            }
        }
    }

    .index_songContainer__1HyQv {
        align-items: center;
        background-color: rgb(245, 246, 250);
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        position: relative;
        width: 100%;
        padding: 300px 0px 100px;



        .index_searchContainer__eVY4Z {
            background-color: rgb(255, 255, 255);
            position: absolute;
            top: -71px;
            border-radius: 20px;


            .index_search__8F3p\+ {
                align-items: center;
                box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 8px;
                box-sizing: border-box;
                display: flex;
                flex-direction: column;
                height: 281px;
                position: relative;
                width: 1160px;
                background: linear-gradient(rgba(255, 58, 58, 0.06), rgba(255, 58, 58, 0) 27.45%), rgb(255, 255, 255);
                border-width: 1px;
                border-style: solid;
                border-color: rgba(0, 0, 0, 0.1);
                border-image: initial;
                border-radius: 20px;
                padding: 40px 60px;


                .index_title__dsVOk {
                    color: rgba(0, 0, 0, 0.8);
                    font-size: 44px;
                    font-weight: 600;
                    line-height: 130%;
                    margin-bottom: 8px;
                }

                .index_text__E\+R\+y {
                    color: rgba(0, 0, 0, 0.6);
                    font-size: 20px;
                    font-weight: 400;
                    line-height: 130%;
                    margin-bottom: 40px;
                }

                .ant-input-group-wrapper {
                    display: inline-block;
                    text-align: start;
                    vertical-align: top;
                    width: 100%;

                    .ant-input-wrapper {
                        -ms-flex-pack: justify;
                        -ms-flex-align: center;
                        align-items: center;
                        background: #fff;
                        border-radius: 10px;
                        box-sizing: border-box;
                        display: -ms-flexbox;
                        display: flex;
                        height: 70px;
                        justify-content: space-between;
                        width: 687px;
                        border: 1px solid rgba(0, 0, 0, .1);
                        border-radius: 10px;
                        width: 1040px;

                        .index_searchWrap__EYiQZ .ant-input-affix-wrapper {
                            -ms-flex-pack: start;
                            border: none;
                            display: -ms-flexbox;
                            display: flex;
                            -ms-flex: 1 1 auto;
                            flex: 1 1 auto;
                            justify-content: flex-start;
                            padding-left: 0;
                            padding-right: 20px;

                            .ant-input-prefix {
                                -ms-flex-pack: center;
                                display: -ms-flexbox;
                                display: flex;
                                -ms-flex: 0 0 auto;
                                flex: 0 0 auto;
                                justify-content: center;
                                width: 52px;

                                .anticon {
                                    -webkit-font-smoothing: antialiased;
                                    -moz-osx-font-smoothing: grayscale;
                                    color: inherit;
                                    display: inline-block;
                                    font-style: normal;
                                    line-height: 0;
                                    text-align: center;
                                    text-rendering: optimizelegibility;
                                    text-transform: none;
                                    vertical-align: -.125em;
                                    align-items: center;
                                    display: flex;
                                    height: 100%;
                                    align-items: center;
                                    display: flex;
                                    height: 100%;
                                }
                            }

                            .ant-input {
                                border: none;
                                caret-color: #ff3a3a;
                                color: rgba(0, 0, 0, .8);
                                -ms-flex: 1 1 auto;
                                flex: 1 1 auto;
                                font-size: 16px;
                                font-weight: 400;
                                line-height: 20px;
                                outline: none;
                            }
                        }
                    }
                }

                .searchWrap {
                    .aigw {
                        display: inline-block;
                        text-align: start;
                        vertical-align: top;
                        width: 100%;

                        .aiw {
                            align-items: center;
                            background: #fff;
                            border: 1px solid rgba(0, 0, 0, .1);
                            border-radius: 10px;
                            width: 1040px;
                            box-sizing: border-box;
                            display: flex;
                            height: 70px;
                            justify-content: space-between;
                            font-size: 14px;
                            font-variant: tabular-nums;
                            line-height: 1.5715;
                            list-style: none;
                            margin: 0;
                            padding: 0;
                            position: relative;
                            color: rgba(0, 0, 0, .85);
                            font-feature-settings: "tnum", "tnum";
                            border-collapse: separate;
                            border-spacing: 0;
                            text-align: start;

                            .aiaw {
                                border-bottom-left-radius: 4px;
                                border-top-left-radius: 4px;
                                border: none;
                                display: flex;
                                flex: 1 1 auto;
                                justify-content: flex-start;
                                padding-left: 0;
                                padding-right: 20px;
                                font-size: 14px;
                                padding: 8px 11px;
                                background-color: #fff;
                                background-image: none;
                                line-height: 1.5715;
                                min-width: 0;
                                position: relative;
                                transition: all .3s;
                                width: 100%;
                                font-feature-settings: "tnum", "tnum";
                                border-collapse: separate;
                                border-spacing: 0;
                                list-style: none;
                                font-variant: tabular-nums;
                                text-align: start;

                                .ant-input-prefix {
                                    display: flex;
                                    margin-right: 4px;
                                    align-items: center;
                                    font-size: 14px;
                                    color: rgba(0, 0, 0, .85);
                                    line-height: 1.5715;
                                    font-feature-settings: "tnum", "tnum";
                                    border-collapse: separate;
                                    border-spacing: 0;
                                    font-variant: tabular-nums;
                                    list-style: none;
                                    text-align: start;
                                    flex: 0 0 auto;
                                    justify-content: center;
                                    width: 52px;

                                    .sfi {
                                        align-items: center;
                                        font-style: normal;
                                        line-height: 0;
                                        text-align: center;
                                        text-rendering: optimizelegibility;
                                        text-transform: none;
                                        vertical-align: -.125em;
                                        color: inherit;
                                        -webkit-font-smoothing: antialiased;
                                        font-size: 14px;
                                        font-feature-settings: "tnum", "tnum";
                                        border-collapse: separate;
                                        border-spacing: 0;
                                        font-variant: tabular-nums;
                                        display: flex;
                                        height: 100%;

                                        svg {
                                            display: inline-block;
                                            line-height: 1;
                                            width: 1em;
                                            height: 1em;
                                            fill: currentcolor;
                                            -webkit-font-smoothing: antialiased;
                                            font-size: 14px;
                                            font-feature-settings: "tnum", "tnum";
                                            border-collapse: separate;
                                            border-spacing: 0;
                                            font-variant: tabular-nums;
                                            list-style: none;
                                            color: inherit;
                                            font-style: normal;
                                            text-align: center;
                                            text-rendering: optimizelegibility;
                                            text-transform: none;
                                        }
                                    }
                                }

                                .ant-input {
                                    width: 976px;
                                    border-bottom-right-radius: 0;
                                    border-top-right-radius: 0;
                                    border: none;
                                    caret-color: #ff3a3a;
                                    color: rgba(0, 0, 0, .8);
                                    padding: 0;
                                    float: left;
                                    margin-bottom: 0;
                                    text-align: inherit;
                                    text-overflow: ellipsis;
                                    touch-action: manipulation;
                                    border-radius: 4px;
                                    font-feature-settings: "tnum", "tnum";
                                    background-color: #fff;
                                    background-image: none;
                                    font-variant: tabular-nums;
                                    list-style: none;
                                    margin: 0;
                                    min-width: 0;
                                    position: relative;
                                    transition: all .3s;
                                    flex: 1 1 auto;
                                    font-size: 16px;
                                    font-weight: 400;
                                    line-height: 20px;
                                    outline: none;
                                }
                            }

                            .aiaw:not(:last-child) {
                                border-bottom-right-radius: 0;
                                border-top-right-radius: 0;
                            }

                            .aiga {
                                left: 0;
                                border: 0;
                                border-bottom-left-radius: 0;
                                border-top-left-radius: 0;
                                width: 112px;
                                padding: 0;
                                background-color: #fafafa;
                                border-radius: 4px;
                                color: rgba(0, 0, 0, .85);
                                font-size: 14px;
                                font-weight: 400;
                                vertical-align: middle;
                                white-space: nowrap;
                                display: table-cell;
                                font-feature-settings: "tnum", "tnum";
                                border-collapse: separate;
                                border-spacing: 0;
                                font-variant: tabular-nums;
                                line-height: 1.5715;
                                list-style: none;
                                position: relative;
                                text-align: center;
                                transition: all .3s;

                                .ant-btn {
                                    border-radius: 0 4px 4px 0;
                                    padding-bottom: 0;
                                    padding-top: 0;
                                    background-color: #fff;
                                    border: none;
                                    border-left: 1px solid rgba(0, 0, 0, .1);
                                    box-shadow: none;
                                    color: #000;
                                    font-size: 16px;
                                    font-weight: 500;
                                    height: 48px;
                                    line-height: 20px;
                                    text-shadow: none;
                                    width: 100%;
                                    z-index: 999;
                                    -webkit-appearance: button;
                                    background: var(--ant-primary-color);
                                    padding: 8px 24px;
                                    outline: 0;
                                    position: relative;
                                    text-align: center;
                                    touch-action: manipulation;
                                    transition: all .3s cubic-bezier(.645, .045, .355, 1);
                                    text-transform: none;
                                    overflow: visible;
                                    font-family: inherit;
                                    margin: 0;
                                    border-collapse: separate;
                                    border-spacing: 0;
                                    list-style: none;
                                    user-select: none;
                                    white-space: nowrap;
                                }
                            }
                        }
                    }
                }


                .index_balance__\+cZQ0 {
                    position: absolute;
                    right: 0px;
                    top: -269px;
                }
            }

            .ib {
                position: absolute;
                right: 0;
                top: -269px;
                box-sizing: border-box;

                .ibu {
                    backdrop-filter: blur(7.5px);
                    background: #fff;
                    border: 1px solid hsla(0, 0%, 100%, .2);
                    border-radius: 12px;
                    height: 198px;
                    padding: 24px;
                    width: 300px;
                    box-sizing: border-box;

                    .itx {
                        align-items: center;
                        display: flex;
                        justify-content: space-between;
                        box-sizing: border-box;

                        .ity {
                            color: rgba(0, 0, 0, .8);
                            font-size: 18px;
                            font-weight: 500;
                            line-height: 25px;
                            box-sizing: border-box;

                        }

                        .ilw {
                            color: #507daf;
                            font-size: 12px;
                            font-weight: 400;
                            line-height: 12px;
                            box-sizing: border-box;

                            a {
                                background-color: transparent;
                                color: #507daf;
                                cursor: pointer;
                                outline: none;
                                text-decoration: none;
                                transition: color .3s;

                                .anticon {
                                    -webkit-font-smoothing: antialiased;
                                    -moz-osx-font-smoothing: grayscale;
                                    color: inherit;
                                    display: inline-block;
                                    font-style: normal;
                                    line-height: 0;
                                    text-align: center;
                                    text-rendering: optimizelegibility;
                                    text-transform: none;
                                    vertical-align: -.125em;
                                }

                                svg {
                                    display: inline-block;
                                    box-sizing: border-box;
                                    line-height: 1;
                                    width: 1em;
                                    height: 1em;
                                    fill: currentcolor;
                                }
                            }
                        }
                    }

                    .ibl {
                        margin-top: 16px;
                        box-sizing: border-box;

                        .isn {
                            color: rgba(0, 0, 0, .8);
                            font-size: 24px;
                            font-weight: 700;
                            line-height: 29px;
                        }

                        .idt {
                            color: rgba(0, 0, 0, .8);
                            font-size: 12px;
                            font-weight: 400;
                            line-height: 14px;
                            margin-top: 4px;
                            opacity: .9;
                            box-sizing: border-box;

                            .inr {
                                padding: 0 4px;
                                box-sizing: border-box;
                                color: rgba(0, 0, 0, .8);
                                font-size: 12px;
                                font-weight: 400;
                                line-height: 14px;
                            }
                        }
                    }

                    .at {
                        background: #ff3a3a;
                        border: none;
                        border-radius: 17px;
                        box-sizing: border-box;
                        color: #fff;
                        font-size: 14px;
                        font-weight: 500;
                        height: 34px;
                        line-height: 22px;
                        margin-top: 28px;
                        padding: 6px 24px;
                        width: 90px;
                        -webkit-appearance: button;
                    }
                }
            }
        }


        .index_songWrap__0L-d6 {

            height: 380px;
            margin-bottom: 48px;
            width: 1160px;
            box-sizing: border-box;
            display: block;

            .index_title__zv7uf {
                align-items: center;
                display: flex;
                justify-content: space-between;
                margin-bottom: 24px;
                box-sizing: border-box;

                .index_text__czqUa {
                    font-size: 28px;
                    font-weight: 700;
                    line-height: 32px;
                }

                a {
                    color: rgba(0, 0, 0, .6);
                    font-size: 18px;
                    font-weight: 400;
                    line-height: 25px;
                    box-sizing: border-box;
                    touch-action: manipulation;
                    cursor: pointer;
                    outline: none;
                    text-decoration: none;
                    transition: color .3s;

                    .anticon {
                        -webkit-font-smoothing: antialiased;
                        -moz-osx-font-smoothing: grayscale;
                        color: inherit;
                        display: inline-block;
                        font-style: normal;
                        line-height: 0;
                        text-align: center;
                        text-rendering: optimizelegibility;
                        text-transform: none;
                        vertical-align: -.125em;
                    }
                }
            }

            .index_listContainer__WNPVn {
                display: flex;
                justify-content: flex-start;
                box-sizing: border-box;
                unicode-bidi: isolate;

                .index_listItem__nU5Gg {
                    background-color: #fff;
                    border-radius: 16px;
                    box-shadow: 0 0 8px rgba(0, 0, 0, .02);
                    box-sizing: border-box;
                    display: -ms-flexbox;
                    display: flex;
                    -ms-flex-direction: column;
                    flex-direction: column;
                    height: 324px;
                    margin-right: 20px;
                    width: 216px;

                    .index_desc__vfEks {
                        padding: 16px 16px 10px;
                        box-sizing: border-box;

                        .index_image__qrxni {
                            border-radius: 12px;
                            height: 184px;
                            overflow: hidden;
                            width: 184px;
                            box-sizing: border-box;

                            img {
                                overflow-clip-margin: content-box;
                                overflow: clip;
                                width: 184px;
                                height: 184px;
                                border-style: none;
                                vertical-align: middle;
                                box-sizing: border-box;
                            }
                        }

                        .index_songName__RUIil {
                            color: #202a44;
                            font-size: 20px;
                            font-weight: 500;
                            line-height: 22px;
                            margin-top: 12px;
                            max-width: 184px;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            white-space: nowrap;
                            box-sizing: border-box;
                        }

                        .index_artistName__FGrxd {
                            color: rgba(0, 0, 0, .6);
                            font-size: 14px;
                            font-weight: 400;
                            line-height: 22px;
                            margin-top: 8px;
                            max-width: 184px;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            white-space: nowrap;
                            box-sizing: border-box;
                        }
                    }

                    .index_pushSong__b5Sre {
                        align-items: flex-end;
                        border-top: 1px solid rgba(0, 0, 0, .05);
                        box-sizing: border-box;
                        display: -ms-flexbox;
                        display: flex;
                        height: 34px;
                        justify-content: space-between;
                        padding: 10px 16px 0;

                        img {
                            border-style: none;
                            vertical-align: middle;
                            box-sizing: border-box;
                            width: 18px;
                            height: 18px;
                            position: relative;
                            top: -2px;
                            overflow-clip-margin: content-box;
                            overflow: clip;
                        }

                        .index_text__czqUa {
                            color: rgba(0, 0, 0, .6);
                            -ms-flex: 1 1 auto;
                            flex: 1 1 auto;
                            font-size: 16px;
                            font-weight: 400;
                            line-height: 22px;
                            margin-left: 4px;
                            box-sizing: border-box;
                        }

                        .index_btn__7CgVP {
                            -ms-flex-pack: center;
                            -ms-flex-align: center;
                            align-items: center;
                            background: #ff3a3a;
                            border: none;
                            border-radius: 24px;
                            box-sizing: border-box;
                            color: #fff;
                            cursor: pointer;
                            display: -ms-flexbox;
                            display: flex;
                            font-size: 12px;
                            font-weight: 500;
                            height: 24px;
                            justify-content: center;
                            line-height: 22px;
                            width: 48px;
                        }
                    }
                }
            }
        }

    }

    .index_clientContainer__o2\+HF {
        -ms-flex-pack: center;
        background-color: #000;
        background-position: top 81px right 0;
        background-repeat: no-repeat;
        background-size: 50%;
        box-sizing: border-box;
        display: -ms-flexbox;
        display: flex;
        justify-content: center;
        position: relative;

        .index_clientWrap__\+z7K\+ {
            box-sizing: border-box;
            height: 671px;
            padding: 120px 140px 0;
            width: 1440px;

            .index_title__dsVOk {
                color: #fff;
                font-size: 48px;
                font-weight: 700;
                line-height: 130%;
                box-sizing: border-box;
            }

            .index_text__E\+R\+y {
                color: hsla(0, 0%, 100%, .8);
                font-size: 20px;
                font-weight: 400;
                line-height: 130%;
                margin-top: 20px;

                .index_num__YVw8l {
                    color: #ff3a3a;
                    font-size: 30px;
                    font-weight: 700;
                    line-height: 39px;
                    padding: 0 3px;
                    box-sizing: border-box;
                    position: relative;

                    .index_digit__7ZzD\+ {
                        font-family: dolphinBold;
                        box-sizing: border-box;
                        color: #ff3a3a;
                        font-size: 30px;
                        font-weight: 700;
                        line-height: 39px;
                    }

                    .index_unit__qNkKM {
                        font-size: 16px;
                        box-sizing: border-box;
                        color: #ff3a3a;
                        font-weight: 700;
                        line-height: 39px;
                    }
                }

                .index_num__YVw8l:after {
                    background: #ff3a3a;
                    border-radius: 2px;
                    bottom: -6px;
                    box-sizing: border-box;
                    content: "";
                    height: 4px;
                    left: 5px;
                    position: absolute;
                    width: 40px;
                    color: #ff3a3a;
                    font-size: 30px;
                    font-weight: 700;
                    line-height: 39px;
                }

            }

            .index_subTitle__ni0Fx {
                color: #fff;
                font-size: 34px;
                font-weight: 700;
                line-height: 130%;
                margin-top: 125px;
            }
        }
    }

    .index_questionContainer__0G9yD {
        background-color: #fff;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        min-width: 1440px;

        .index_questionWrap__YgYYy {
            box-sizing: border-box;
            padding: 100px 240px 93px 140px;
            width: 1440px;

            .index_title__dsVOk {
                align-items: center;
                display: flex;
                justify-content: space-between;
                box-sizing: border-box;

                .index_text__E\+R\+y {
                    color: #202a44;
                    font-size: 48px;
                    font-weight: 700;
                    line-height: 130%;
                    box-sizing: border-box;
                }

                a {

                    background-color: transparent;
                    color: #507daf;
                    cursor: pointer;
                    outline: none;
                    text-decoration: none;
                    transition: color .3s;

                    .anticon {
                        -webkit-font-smoothing: antialiased;
                        color: inherit;
                        display: inline-block;
                        font-style: normal;
                        line-height: 0;
                        text-align: center;
                        text-rendering: optimizelegibility;
                        text-transform: none;
                        vertical-align: -.125em;

                        svg {
                            display: inline-block;
                            box-sizing: border-box;
                            line-height: 1;
                            width: 1em;
                            height: 1em;
                            fill: currentcolor;
                        }

                        svg:not(:root) {
                            overflow-clip-margin: content-box;
                            overflow: hidden;
                        }
                    }
                }

                .index_link__dqG8V {
                    color: rgba(0, 0, 0, .6);
                    font-size: 18px;
                    font-weight: 400;
                    line-height: 25px;
                    box-sizing: border-box;
                }
            }


            ol {
                margin-bottom: 1em;
                margin-top: 0;
                list-style-type: decimal;
                margin-block-start: 1em;
                margin-block-end: 1em;
                unicode-bidi: isolate;

            }

            .index_questions__j3o0h {
                column-gap: 143px;
                display: flex;
                flex-direction: column;
                flex-wrap: wrap;
                height: 600px;
                margin-top: 60px;
                padding-left: 20px;
                row-gap: 32px;
                box-sizing: border-box;

                .index_questionItem__fswFn {
                    font-size: 18px;
                    font-weight: 600;
                    line-height: 130%;
                    list-style: decimal;
                    width: 445px;

                    .index_single__Rol4J {
                        margin-left: -20px;
                        padding-left: 0;
                    }

                    .index_answers__zv\+Ya {
                        margin-top: 8px;

                        .index_answerItem__sckHY {
                            color: rgba(32, 42, 68, .5);
                            font-size: 16px;
                            font-weight: 400;
                            line-height: 130%;
                            list-style: decimal;
                        }
                    }
                }

            }
        }
    }

    .index_footer__YToEL {
        -ms-flex-pack: center;
        background: #1a1a1a;
        display: -ms-flexbox;
        display: flex;
        height: 172px;
        justify-content: center;
        box-sizing: border-box;

        .index_footerWrap__QMoAs {
            box-sizing: border-box;
            padding: 32px 140px;
            width: 1440px;

            .index_logoContainer__7\+FHa {
                border-bottom: 1px solid hsla(0, 0%, 100%, .3);
                height: 48px;
                margin-bottom: 16px;
                box-sizing: border-box;

                .index_logo__7ymDh {
                    -ms-flex-align: center;
                    align-items: center;
                    display: -ms-flexbox;
                    display: flex;
                    gap: 8px;
                    box-sizing: border-box;

                    .index_imgWrap__E40YF {
                        background-color: #fff;
                        border-radius: 11px;
                        height: 22px;
                        position: relative;
                        width: 22px;
                        box-sizing: border-box;

                        .index_logoImg__O9\+dU {
                            left: -1px;
                            position: absolute;
                            top: -1px;
                        }

                        img {
                            border-style: none;
                            vertical-align: middle;
                            width: 24px;
                            height: 24px;
                            aspect-ratio: auto 24 / 24;
                            overflow: clip;
                        }
                    }

                    .index_logoLink__rqY80 {
                        color: #fff;
                        display: -ms-flexbox;
                        display: flex;
                        font-size: 20px;
                        font-weight: 400;
                        gap: 12px;
                        line-height: 28px;
                        text-decoration: none;
                        box-sizing: border-box;
                        touch-action: manipulation;
                        cursor: pointer;
                        outline: none;
                        transition: color .3s;
                    }
                }

                h1 {
                    margin: 0;
                    list-style: none;
                    padding: 0;
                    color: rgba(0, 0, 0, .85);
                    font-weight: 500;
                }
            }

            .index_text__E\+R\+y {
                color: hsla(0, 0%, 100%, .6);
                font-size: 12px;
                font-weight: 400;
                line-height: 22px;
                box-sizing: border-box;
            }

            .index_text__E\+R\+y {
                color: hsla(0, 0%, 100%, .6);
                font-size: 12px;
                font-weight: 400;
                line-height: 22px;
                box-sizing: border-box;

                a {
                    color: hsla(0, 0%, 100%, .6);
                    background-color: transparent;
                    cursor: pointer;
                    outline: none;
                    text-decoration: none;
                    transition: color .3s;
                }
            }
        }
    }
}
</style>